<template>
  <a-card>
    <p style="text-align: center; font-size: 20px">采购入库退库申请列表</p>

    <!-- 搜索 -->
    <a-form v-bind="layout">
      <a-row>
        <!-- 制单日期 -->
        <a-col :xl="8" :lg="8" :md="12" :sm="24" :xs="24">
          <a-form-model-item label="制单日期" ref="sort" prop="sort">
            <a-range-picker
              style="width: 100%"
              v-model="searchForm.sort"
              @change="
                (a, b) => {
                  this.searchForm.a = a;
                  this.searchForm.beginDate = b[0];
                  this.searchForm.endDate = b[1];
                }
              "
            />
          </a-form-model-item>
        </a-col>

        <a-col :xl="8" :lg="8" :md="12" :sm="24" :xs="24">
          <a-form-model-item label="单据编号">
            <a-select
              v-model="searchForm.document"
              showSearch
              style="width: 100%"
            >
              <a-select-option
                v-for="(item, index) in documentList"
                :key="index"
                :value="item"
              >
                {{ item }}
              </a-select-option>
            </a-select>
          </a-form-model-item>
        </a-col>
        <!-- 存货名称 -->
        <a-col :xl="8" :lg="8" :md="12" :sm="24" :xs="24">
          <a-form-model-item label="存货名称">
            <a-select
              v-model="searchForm.inventoryName"
              style="wdth: 100%"
              @search="handleSearch"
              showSearch
              @change="
                (val) => {
                  const arr = val.split('|');
                  this.searchForm.inventoryId = arr[0];
                  this.searchForm.inventoryNo = arr[1];
                  this.searchForm.inventoryName = arr[2];
                }
              "
            >
              <a-select-option
                v-for="(item, index) in goodsList"
                :key="index"
                :value="
                  item.inventoryId +
                  '|' +
                  item.inventoryNo +
                  '|' +
                  item.inventoryName +
                  '|' +
                  item.specificationsModel +
                  '|' +
                  item.unit
                "
                >{{ item.inventoryNo }} {{ item.inventoryName }}
                {{ item.specificationsModel }} {{ item.unit }}
              </a-select-option>
            </a-select>
          </a-form-model-item>
        </a-col>

        <!-- 供应商 -->
        <a-col :xl="8" :lg="8" :md="12" :sm="24" :xs="24">
          <a-form-model-item label="供应商">
            <!-- <a-select
              showSearch
              style="width: 100%"
              v-model="searchForm.supplier"
            >
              <a-select-option
                v-for="item in supplierList"
                :key="item.value"
                :value="item.value"
                >{{ item.title }}</a-select-option
              >
            </a-select> -->
            <a-select
              v-model="searchForm.supplier_text"
              @change="getfarmerId"
              @search="getAllfarmerList"
              showSearch
              style="width: 100%"
            >
              <a-select-option
                v-for="item in supplierList"
                :key="item.id"
                :value="item.No + '|' + item.name + '|' + item.id"
              >
                {{ item.No }} {{ item.name }}
              </a-select-option>
            </a-select>
          </a-form-model-item>
        </a-col>

        <!-- 仓库名称 -->
        <a-col :xl="8" :lg="8" :md="12" :sm="24" :xs="24">
          <a-form-model-item label="仓库名称">
            <a-select
              v-model="searchForm.depotName"
              @change="
                (val) => {
                  const arr = val.split('|');
                  this.searchForm.depotId = arr[0];
                  this.searchForm.depotName = arr[2];
                }
              "
              showSearch
              style="width: 100%"
            >
              <a-select-option
                v-for="item in storageList"
                :key="item.depotId"
                :value="
                  item.depotId + '|' + item.depotNo + '|' + item.depotName
                "
                >{{ item.depotNo }} {{ item.depotName }}</a-select-option
              >
            </a-select>
          </a-form-model-item>
        </a-col>
        <a-col :xl="8" :lg="8" :md="12" :sm="24" :xs="24">
          <a-form-model-item label="审核状态">
            <a-select v-model="searchForm.auditMark" style="width: 100%">
              <a-select-option
                v-for="(item, index) in danjuzhuangtailist"
                :value="item.value"
                :key="index"
              >
                {{ item.title }}
              </a-select-option>
            </a-select>
          </a-form-model-item>
        </a-col>

        <!-- 所属单位 -->
        <!-- <a-col :xl="8" :lg="8" :md="12" :sm="24" :xs="24">
          <a-form-model-item label="所属单位">
            <a-select
              @change="
                (val) => {
                  const arr = val.split('|');
                  this.searchForm.storageUnit = arr[0];
                  this.searchForm.storageUnitName = arr[2];
                }
              "
              v-model="searchForm.storageUnitName"
              showSearch
              style="width: 100%"
            >
              <a-select-option
                v-for="item in storageList"
                :key="item.depotId"
                :value="
                  item.depotId + '|' + item.depotNo + '|' + item.depotName
                "
                >{{ item.depotNo }} {{ item.depotName }}</a-select-option
              >
            </a-select>
          </a-form-model-item>
        </a-col> -->
      </a-row>
      <a-row>
        <a-col :xl="8" :lg="8" :md="12" :sm="24" :xs="24">
          <a-form-model-item
            label="业务类型"
            ref="yewuleixing"
            prop="yewuleixing"
          >
            <a-select
              v-model="searchForm.businame"
              style="width: 100%"
              showSearch
              @change="yewuleixingChange"
            >
              <a-select-option
                v-for="(item, index) in yewuleixingList"
                :key="index"
                :value="
                  item.busicode + '|' + item.businame + '|' + item.pkBusitype
                "
                >{{ item.businame }}
              </a-select-option>
            </a-select>
          </a-form-model-item>
        </a-col>
        <a-col :xl="8" :lg="8" :md="12" :sm="24" :xs="24">
          <a-form-model-item label="源单单号">
            <a-select
              v-model="searchForm.sourceNumber"
              showSearch
              style="width: 100%"
            >
              <a-select-option
                v-for="(item, index) in sourceNumberList"
                :key="index"
                :value="item"
              >
                {{ item }}
              </a-select-option>
            </a-select>
          </a-form-model-item>
        </a-col>
      </a-row>
      <a-row>
        <a-col :xl="8" :lg="8" :md="12" :sm="24" :xs="24"></a-col>
        <a-col :xl="8" :lg="8" :md="12" :sm="24" :xs="24"></a-col>
        <a-col :xl="8" :lg="8" :md="12" :sm="24" :xs="24" align="right">
          <a-button type="primary" @click="Search()">查询</a-button>
          <a-button style="margin-left: 8px" @click="Reset()">重置</a-button>
        </a-col>
      </a-row>
    </a-form>

    <a-table
      v-cloak
      :columns="columns"
      :data-source="dataSource"
      :pagination="pagination"
      @change="handleTableChange"
      style="margin-top: 20px"
      :scroll="{ x: 1900, y: 670 }"
      size="small"
    >
      <span slot="document" slot-scope="text, record">
        <a @click="RouterJump(record)"> {{ text }} </a>
      </span>
      <span slot="action" slot-scope="text, record">
        <a-popconfirm
          v-if="record.auditMark_dictText == '未审核'"
          title="确定删除?"
          ok-text="是的!"
          cancel-text="我再想想!"
          @confirm="onDelete(record)"
        >
          <a href="#">删除</a>
        </a-popconfirm>

        <a v-if="record.auditMark_dictText == '已审核'" style="color: #666666">
          <a-tooltip>
            <template slot="title"> 不允许删除 </template>
            删除
          </a-tooltip>
        </a>
      </span>
    </a-table>
  </a-card>
</template>
<script>
// ------- 公用接口 ------- ;
import { CommonAjax } from "@/services/modules/common";
const comHttp = new CommonAjax();
import { CaiGouRuKuHttp } from "@/services/modules/RuKuGuGuanLi/CaiGouRuKu";
const cgrkHttp = new CaiGouRuKuHttp(); // 采购入库
const columns = [
  {
    title: "序号",
    dataIndex: "key",
    key: "key",
    align: "center",
    width: "50px",
  },
  {
    title: "日期",
    dataIndex: "documentDate",
    key: "documentDate",
    align: "center",
    width: "90px",
  },
  {
    title: "审核标志",
    dataIndex: "auditMark_dictText",
    key: "auditMark_dictText",
    align: "center",
    width: "80px",
  },
  {
    title: "单据编号",
    dataIndex: "document",
    key: "document",
    align: "center",
    width: "110px",
    scopedSlots: { customRender: "document" },
  },
  {
    title: "供应商",
    dataIndex: "supplier_dictText",
    key: "supplier_dictText",
    align: "center",
    width: "120px",
  },
  //!depotId_dictText改成了storname
  {
    title: "仓库名称",
    dataIndex: "storname",
    key: "storname",
    align: "center",
    width: "110px",
  },

  {
    title: "业务类型",
    dataIndex: "cbiztype_dictText",
    key: "cbiztype_dictText",
    align: "center",
    width: "100px",
  },
  // {
  //   title: "所属单位",
  //   dataIndex: "storageUnit_dictText",
  //   key: "storageUnit_dictText",
  //   align: "center",
  // },
  {
    title: "存货编码",
    dataIndex: "invcode",
    key: "invcode",
    align: "center",
    width: "100px",
  },
  {
    title: "存货名称",
    dataIndex: "invname",
    key: "invname",
    align: "center",
    width: "100px",
  },

  {
    title: "规格型号",
    dataIndex: "invspec",
    key: "invspec",
    align: "center",
    width: "80px",
  },
  {
    title: "单位",
    dataIndex: "measname",
    key: "measname",
    align: "center",
    width: "50px",
  },
  {
    title: "单价",
    dataIndex: "unitPrice",
    key: "unitPrice",
    align: "center",
    width: "50px",
  },

  {
    title: "数量",
    dataIndex: "quantity",
    key: "quantity",
    align: "center",
    width: "50px",
  },

  {
    title: "金额",
    dataIndex: "money",
    key: "money",
    align: "center",
    width: "50px",
  },
  {
    title: "制单人",
    dataIndex: "singleProducer_dictText",
    key: "singleProducer_dictText",
    align: "center",
    width: "80px",
  },
  {
    title: "源单号",
    dataIndex: "sourceNumber",
    key: "sourceNumber",
    width: "100px",

    align: "center",
  },
  //业务员
  // {
  //   title: "业务员",
  //   dataIndex: "yewuyuan",
  //   key: "yewuyuan",
  //   align: "center",
  // },
  {
    title: "备注",
    dataIndex: "remark",
    key: "remark",
    align: "center",
    width: "80px",
  },
  {
    title: "操作",
    key: "action",
    width: "80px",
    scopedSlots: { customRender: "action" },
  },
];

const rowSelection = {
  onChange: (selectedRowKeys, selectedRows) => {
    console.log(
      `selectedRowKeys: ${selectedRowKeys}`,
      "selectedRows: ",
      selectedRows
    );
  },
  onSelect: (record, selected, selectedRows) => {
    console.log(record, selected, selectedRows);
  },
  onSelectAll: (selected, selectedRows, changeRows) => {
    console.log(selected, selectedRows, changeRows);
  },
};

export default {
  data() {
    return {
      yewuleixingList: [], //业务类型
      sourceNumberList: [], // 返回采购入库单编号

      // ---------- 分页使用 -------------
      pagination: {
        total: 0,
        current: 1,
        pageSize: 10, //每页中显示10条数据
        // showSizeChanger: true,
        pageSizeOptions: ["5", "10", "20", "30"], //每页中显示的数据
        showTotal: (total) => `共有${total}条数据`, //分页中显示总的数据
        showSizeChanger: true, // 显示页面条数改变
        showQuickJumper: true, // 显示快速跳转
      },
      queryParam: {
        //查询参数
        page: 1, //第几页
        size: 10, //每页中显示数据的条数
        hosName: "",
        hosCode: "",
        province: "",
        city: "",
      },
      // 搜索栏布局
      layout: {
        labelCol: { span: 8 },
        wrapperCol: { span: 15 },
      },
      // 搜索列表
      searchForm: {
        cbiztype: "", //业务类型
        auditMark: "", //单据状态
        beginDate: "", // 起始日期
        endDate: "", // 终止日期
        document: null, // 单据编号
        inventoryId: null, // 存货名称
        inventoryNo: null,
        supplier: null, // 供应商
        supplier_text: null,
        depotId: null, // 仓库名称
        depotName: null,
        storageUnit: null, // 所属单位名称
        storageUnitName: null,
      },

      // 销售出库订单列表
      columns,
      dataSource: [],
      rowSelection,
      documentList: [], // 订单列表，返回所有的销售出库单
      storageList: [], // 仓库
      storageGoodsList: [], // 存货
      goodsList: [], //存货名称列表
      supplierList: [], // 供应商
      ALLOrderList: [], // 所有的订单列表,存储订单单号
      danjuzhuangtailist: [], //单据状态

      queryPathCache: "", // 查询缓存
    };
  },

  watch: {
    $route: function (to, form) {
      if (
        to.path == "/purchaseCancelApplyList" &&
        form.path == "/purchaseCancelApply"
      ) {
        console.log("--------- 更新视图 采购入库列表  ----------");
        this.getOutStorageList();
      }

      if (
        to.path == "/purchaseCancelApplyList" &&
        form.path == "/purchaseCancelApplyDetail"
      ) {
        console.log("--------- 更新视图 采购入库列表  ----------");
        this.getOutStorageList();
      }
    },
  },

  mounted() {
    // this.getGoodsList(); //获取存货名称代码
    // this.getSupplierList(); //获取供应商列表
    this.getDocumentList(); //获取单据号列表
    this.getsourceNumberList(); //获取采购入库单单据号
    this.getOutStorageList();
    this.getApplyStorage(); // 仓库列表
    // this.getSaleDepartmentList(); // 获取销售部门
    this.getAuditMarkAndDocumentStatus(); //单据状态
    this.getsyncbusinesstype_U8c(); //获取业务类型
  },
  methods: {
    handleSearch(value) {
      //模糊查询
      this.goodsList = [];
      console.log("value", value);
      let query = "?name=" + value;
      console.log("query", query);
      if (value == "" || value == null) {
        this.goodsList = [];
      } else {
        comHttp.getgetSearchInventoryInformationFile(query).then((res) => {
          console.log("结果为", res);
          // this.goodsList = res.result;
          for (let i = 0; i < res.result.length; i++) {
            if (
              res.result[i].specificationsModel == "null" ||
              res.result[i].specificationsModel == null
            ) {
              res.result[i].specificationsModel = "";
            }
            if (res.result[i].unit == "null" || res.result[i].unit == null) {
              res.result[i].unit = "";
            }
            let data = {
              inventoryId: res.result[i].pkInvbasdoc, // 存货 id
              inventoryNo: res.result[i].invcode, //存货编码
              inventoryName: res.result[i].invname, //存货名称
              specificationsModel: res.result[i].invspec, //规格型号
              unit: res.result[i].measname, //单位
            };
            this.goodsList.push(data);
          }
        });
      }
    },
    //获取业务类型
    getsyncbusinesstype_U8c() {
      cgrkHttp.getsyncbusinesstype_U8c().then((res) => {
        console.log("所有的业务类型", res);

        let _data = res.result;
        _data.forEach((item) => {
          // 匹配数字
          if (item.busicode.match(/^[0-9]{1,20}$/)) {
            if (item.busicode.substr(0, 1) == "1") {
              this.yewuleixingList.push(item);
            }
          }
        });
        console.log("筛选后的业务类型_1开头的用于采购", this.yewuleixingList);
      });
    },
    //业务类型change函数
    yewuleixingChange(value, option) {
      console.log("option", option);
      // this.form.id = option.key;
      const newValue = value.split("|");
      console.log(newValue);
      this.searchForm.busicode = newValue[0];
      this.searchForm.businame = newValue[1];
      this.searchForm.cbiztype = newValue[2];
    },

    // 获取单据号列表
    getsourceNumberList() {
      let queryPath = "?string=CGDD-";
      comHttp.getSourceNumber(queryPath).then((res) => {
        console.log("获取采购源单列表:::::", res);
        for (let i = 0; i < res.result.length; i++) {
          this.sourceNumberList.push(res.result[i]);
        }
      });
    },
    // 路由跳转函数
    RouterJump(record) {
      if (record.auditMark === 1) {
        // 已审核 跳转详情列表
        this.$router.push({
          path: "purchaseCancelApplyDetail",
          query: {
            id: record.id,
            document: record.document,
            auditMark: record.auditMark,
          },
        });
      } else if (record.auditMark === 2) {
        // 未审核 跳转详情列表
        //!如果不是审核人就去详情页面，注释下面代码实现
        // if (
        //   record.singleProducer == this.$store.state.user.info.id &&
        //   record.inspector !== this.$store.state.user.info.id
        // ) {
        //   // 制单人 == 当前登录人 && 审核人 ！= 当前登录人
        //   // 去修改吧！！！
        //   this.$router.push({
        //     path: "purchaseCancelApply",
        //     query: {
        //       document: record.document,
        //       auditMark: record.auditMark,
        //       singleProducer: record.singleProducer,
        //     },
        //   });
        //   return;
        // }

        this.$router.push({
          path: "purchaseCancelApplyDetail",
          query: {
            id: record.id,
            document: record.document,
            auditMark: record.auditMark,
          },
        });
      }
    },

    // 分页函数
    handleTableChange(pagination) {
      this.pagination.current = pagination.current;
      this.pagination.pageSize = pagination.pageSize;
      this.queryParam.page = pagination.current;
      this.queryParam.size = pagination.pageSize;
      let queryPath = this.getQueryPath();
      this.getOutStorageList(queryPath);
    },

    // 获取单据号列表
    getDocumentList() {
      let queryPath = "?string=CGRKTS-";
      cgrkHttp.getDocumetByString(queryPath).then((res) => {
        // console.log("获取采购入库单据号列表:::::", res);
        for (let i = 0; i < res.result.length; i++) {
          this.documentList.push(res.result[i]);
        }
      });
    },
    // 删除
    onDelete(record) {
      cgrkHttp
        .getturnrequestformdelete_back_delete("?id=" + record.id)
        .then((res) => {
          if (res.success) {
            this.$message.success("删除成功");
            this.getOutStorageList();
          } else {
            this.$message.error("删除失败");
          }
        });
    },
    // 查询
    Search() {
      console.log(" [--- searchForm ---] ", this.searchForm);
      let {
        beginDate,
        endDate,
        document,
        inventoryId,
        supplier,
        depotId,
        storageUnit,
        auditMark,
        cbiztype,
        sourceNumber,
      } = this.searchForm;

      let query = "";
      if (beginDate) {
        query += `&beginDate=${beginDate}&endDate=${endDate}`;
      }
      if (document) {
        query += `&document=${document}`;
      }
      if (inventoryId) {
        query += `&inventoryId=${inventoryId}`;
      }
      if (supplier) {
        query += `&supplier=${supplier}`;
      }
      if (depotId) {
        query += `&depotId=${depotId}`;
      }
      if (storageUnit) {
        query += `&depotId=${storageUnit}`;
      }
      if (cbiztype) {
        query += `&cbiztype=${cbiztype}`;
      }
      if (sourceNumber) {
        query += `&sourceNumber=${sourceNumber}`;
      }
      if (auditMark && auditMark !== "3") {
        query += `&auditMark=${auditMark}`;
      }
      this.queryPathCache = query;

      this.getOutStorageList(); // 重新获取列表

      // let queryPath = this.getQueryPath();
      // this.getOutStorageList(queryPath);
      // console.log("查询条件为:::", queryPath);
    },

    // 获取全局查询条件
    getQueryPath() {
      console.log(this.searchForm);

      let queryPath =
        "?pageNo=" +
        this.queryParam.page +
        "&inOutCategoryIdentification=1" +
        "&inOutIdentification=1" +
        "&document=" +
        this.searchForm.document + // 单据编号
        "&deptId=" +
        this.searchForm.deptId + //所属单位
        "&depotId=" +
        this.searchForm.depotId + // 仓库名称
        "&inventoryId=" +
        this.searchForm.inventoryId + // 存货名称
        "&endDate=" +
        this.searchForm.endTime +
        "&beginDate=" +
        this.searchForm.startTime +
        "&auditMark=" +
        this.searchForm.auditMark; //
      return queryPath; // 返回的查询条件
    },

    /**
     * @description: 采购入库列表渲染数据 获取采购入库列表  默认查询路径为第一页,
     * @param {*}
     * @return {*}
     */
    getOutStorageList() {
      // 出入库类别标识:销售出库,出库
      const { current, pageSize } = this.pagination;
      let _query = `?pageNo=${current}&pageSize=${pageSize}`;
      _query += `&inOutCategoryIdentification=7&inOutIdentification=3`;
      _query += this.queryPathCache;

      cgrkHttp.getwarehousereturnrequestlist_back(_query).then((res) => {
        const pagination = { ...this.pagination };
        let records = res.result.records;
        const giveaway_dictText = {
          1: "是",
          2: "否",
        };

        pagination.total = res.result.total;
        pagination.pageSize = res.result.size;
        pagination.current = res.result.current;

        this.dataSource = [];
        this.ALLOrderList = [];
        this.pagination = pagination;

        console.log(" [INFO] [获取列表]", records);

        let curDocument = "";

        records.forEach((item, index) => {
          // 进行 单据编号 判断重复唯一值

          if (item.document === curDocument) {
            curDocument = item.document;
            item.document = "";
          } else {
            curDocument = item.document;
          }

          // item.key = (pagination.current - 1) * 10 + index + 1;
          (item.key = (pagination.current - 1) * res.result.size + index + 1),
            (item.giveaway_dictText = giveaway_dictText[item.giveaway]);
        });
        this.dataSource = records;
      });
    },

    // 根据仓库Id获取物品信息
    getGoodSInfo(id) {
      this.goodsList = [];
      comHttp.getInventoryInformationByStorageId("?id=" + id).then((res) => {
        console.log("获取存货信息:::::", res);
        for (let i = 0; i < res.result.length; i++) {
          let data = {
            inventoryId: res.result[i].pkInvbasdoc, // 存货 id
            inventoryName: res.result[i].invname,
            inventoryNo: res.result[i].invcode,
          };
          this.goodsList.push(data);
        }
      });
    },
    getGoodsList() {
      let goodsList = [];
      cgrkHttp.getGoodsList().then((res) => {
        console.log("----- 获取存货名称列表 -----", res);
        for (let i = 0; i < res.result.records.length; i++) {
          let data = {
            inventoryId: res.result.records[i].id, // 存货 id
            title: res.result.records[i].inventoryName,
            value: res.result.records[i].inventoryNo,
          };
          this.goodsList.push(data);
        }
        console.log("----- goodsList -----", goodsList);
      });
      return goodsList;
    },

    // 获取仓库列表
    getApplyStorage() {
      this.storageList = [];
      // 获取仓库名称
      comHttp.getAllNumberName_new_forU8c().then((res) => {
        console.log("获取所有仓库", res);
        for (let i = 0; i < res.result.length; i++) {
          let data = {
            depotName: res.result[i].storname,
            depotNo: res.result[i].storcode,
            depotId: res.result[i].pkStordoc,
          };
          this.storageList.push(data);
        }
      });
    },
    //单据状态
    getAuditMarkAndDocumentStatus() {
      comHttp.getAuditMarkAndDocumentStatus().then((res) => {
        this.danjuzhuangtailist = res.result;
        console.log(`单据状态:${this.danjuzhuangtailist}`);
      });
    },
    getAllfarmerList(value) {
      if (value != "") {
        comHttp
          .queryByLikeName("?customerName=" + value + "&custflag=1,3")
          .then((res) => {
            this.supplierList = [];
            console.log("所有的供应商信息::::", res);
            for (let i = 0; i < res.result.list.length; i++) {
              let data = {
                No: res.result.list[i].custcode, //编号
                id: res.result.list[i].pkCumandoc,
                name: res.result.list[i].custname,
              };

              this.supplierList.push(data);
            }
          });
        console.log("this.supplierList", this.supplierList);
      }
    },
    // 获取供应商change列表
    getfarmerId(value, options) {
      console.log("供应商::::", value, options.key);
      let array = value.split("|");
      console.log("array", array);
      this.searchForm.supplier = array[2];
      this.searchForm.supplier_text = array[1];
    },
    // //获取供应商列表
    // getSupplierList() {
    //   this.supplierList = [];
    //   cgrkHttp.getSupplierList().then((res) => {
    //     // console.log("----- 供应商列表信息 -----", res);
    //     for (let i = 0; i < res.result.records.length; i++) {
    //       let data = {
    //         title: res.result.records[i].suppilerName,
    //         value: res.result.records[i].id,
    //       };
    //       this.supplierList.push(data);
    //     }
    //   });
    // },

    // 重置查询条件
    Reset() {
      this.searchForm = {
        beginDate: "", // 起始日期
        endDate: "", // 终止日期
        document: null, // 单据编号
        inventoryId: null, // 存货名称
        inventoryName: null,
        supplier: null, // 供应商
        depotId: null, // 仓库名称
        depotName: null,
        storageUnit: null, // 所属单位名称
        storageUnitName: null,
      };

      this.pagination = {
        total: 0,
        current: 1,
        pageSize: 10, //每页中显示10条数据
        // showSizeChanger: true,
        pageSizeOptions: ["10"], //每页中显示的数据
        showTotal: (total) => `共有${total}条数据`, //分页中显示总的数据
      };

      this.queryPathCache = "";
      this.getOutStorageList();
    },
  },
};
</script>
<style scoped lang="less">
.avatar-uploader > .ant-upload {
  width: 160px;
  height: 160px;
}
.ant-upload-select-picture-card i {
  font-size: 32px;
  color: #999;
}

.ant-upload-select-picture-card .ant-upload-text {
  margin-top: 8px;
  color: #666;
}
textarea {
  border: 0;
  border-radius: 5px;
  border: 1px #d9d9d9 solid;
  width: 100%;
  height: 100px;
  padding: 10px;
  resize: none;
}
#feng_kong_cuo_shi_1 {
  width: 700px;
}
</style>
